.login-contain {
	width: 100%;
	height: 100%;
	background-image: url(../assets/logoin.png);
	background-size: cover; /* 使图片平铺满整个浏览器（从宽和高的最大需求方面来满足，会使某些部分无法显示在区域中） */
	position: absolute; /* 不可缺少 */
	// display: flex;
	// justify-content: flex-end;
	// img {
	// 	width: 100%;
	// 	height: 100%;
	// }
	.header {
		display: flex;
		align-items: center;
		width: 100%;
		height: 8rem;
		background: url(../assets/index/dingbu.png) no-repeat;
		background-size: 100% 100%;
		.header-logo {
			display: flex;
			align-items: center;
			width: 65%;
			margin: 0 auto;
		}
	}
	.login-box {
		width: 23rem;
		height: 26rem;
		background: linear-gradient(to bottom, #ffffff, #ffffff);
		border-radius: 0.63rem;
		position: absolute;
		box-shadow: 0px 0px 6px #888888;
		top: 30%;
		left: 40%;
		// right: 50%;
		display: flex;
		flex-direction: column;
		align-items: center;
		.tab-box {
			width: 50%;
			height: 3.63rem;
			display: flex;
			justify-content: space-between;
			align-items: center;
			color: #999999;
			font-size: 1rem;
			letter-spacing: 0.1rem;
			cursor: pointer;
			.active-tabs {
				color: #146ac1;
				font-size: 1.1rem;
				font-weight: bold;
				position: relative;
				transition: all 0.25s;
				cursor: pointer;
				// border-bottom: 0.2rem solid #98e3e3;
				// width: 50%;
				// display: flex;
				// justify-content: space-between;
				// align-items: center;
				.tab-underline {
					position: absolute;
					top: 1.3rem;
					right: 1.3rem;
					width: 2.2rem;
					border-radius: 0.2rem;
					height: 0.25rem;
					background-color: #d0e1f3;
				}
			}
			// 	.account-login {
			// 		width: 100%;
			// 		height: 100%;
			// 		display: flex;
			// 		background: #61b1f8;
			// 		justify-content: center;
			// 		align-items: center;
			// 		color: #fff;
			// 		font-size: 1rem;
			// 	}

			// 	.active {
			// 		width: 50%;
			// 		height: 100%;
			// 		background-color: #61b1f8;
			// 		font-size: 0.9rem;
			// 	}
		}
		.tab-card {
			width: 20.38rem;
			height: auto;
			// margin: 1.7rem auto 2.5rem;
			display: flex;
			flex-direction: column;
			// justify-content: space-around;

			.el-form-item {
				// margin-bottom: 2rem;
			}
			.forgetPassWord {
				margin-top: 0.7rem;
				width: 100%;
				text-align: right;
				color: #146ac1;
				font-weight: bold;
				font-size: 0.95rem;
			}
			.loginInfo {
				margin: auto;
				padding-top: 1rem;
				.noAccount {
					font-weight: bold;
					color: #999999;
					font-size: 0.875rem;
				}
				.rigister {
					font-weight: bold;
					color: #146ac1;
					font-size: 0.875rem;
					cursor: pointer;
				}
			}
			/deep/ .el-form-item__label {
				margin: 0;
				text-align: left;
				color: #000;
				float: none;
				font-weight: bold;
				// float:left !important;
				// font-size: 1rem;
				// margin-bottom: 1rem;
			}

			/deep/ .el-input .el-input__inner,
			.el-input--suffix .el-input__inner {
				height: 2.8rem;
				border: solid 0.06rem #ffffff;
				border-radius: 7px;
				background-color: #f0f0f3;
				color: #ccc;
			}

			/deep/ input::-webkit-input-placeholder {
				color: #999999;
				font-size: 0.81rem;
			}

			.two-content {
				width: 100%;
				display: flex;
				justify-content: space-between;

				.code-box {
					width: 15.25rem;
					background-color: transparent;
				}

				.get-code {
					width: 5rem;
					height: 2.19rem;
					border: solid 0.06rem #5cd1fd;
					background-color: transparent;
					color: #5cd2fd;
					font-size: 0.81rem;
					margin-left: 0.5rem;
				}
			}

			.two-tab {
				width: 100%;
				display: flex;
				justify-content: space-between;

				p {
					margin: 0;
					color: #5cd2fd;
					font-size: 0.75rem;
					cursor: pointer;
				}
			}
		}
		.tab-cards {
			width: 20.38rem;
			height: auto;
			// background: pink;
			// margin: 1.7rem auto 2.5rem;
			display: flex;
			flex-direction: column;
			// justify-content: space-around;

			.el-form-item {
				// margin-bottom: 2rem;
			}

			/deep/ .el-form-item__label {
				margin: 0;
				text-align: left;
				color: #fff;
				// font-size: 1rem;
				// margin-bottom: 1rem;
			}

			/deep/.el-form-item__content {
				display: flex;
			}
			/deep/ .el-input .el-input__inner,
			.el-input--suffix .el-input__inner {
				height: 2.19rem;
				border: solid 0.06rem #5cd1fd;
				background-color: transparent;
				color: #fff;
				width: 15rem;
			}

			/deep/ input::-webkit-input-placeholder {
				color: #5cd2fd;
				font-size: 0.81rem;
			}

			.two-content {
				width: 100%;
				display: flex;
				justify-content: space-between;

				.code-box {
					width: 15.25rem;
					background-color: transparent;
				}

				.get-code {
					width: 5rem;
					height: 2.19rem;
					border: solid 0.06rem #5cd1fd;
					background-color: transparent;
					color: #5cd2fd;
					font-size: 0.81rem;
					margin-left: 0.5rem;
				}
			}

			.two-tab {
				width: 100%;
				display: flex;
				justify-content: space-between;

				p {
					margin: 0;
					color: #5cd2fd;
					font-size: 0.75rem;
					cursor: pointer;
				}
			}
		}
		.el-button--primary {
			width: 20.63rem;
			height: 2.63rem;
			background-color: #0f8adb;
			border: solid 0.06rem #68afee;
			font-size: 1rem;
			color: #fff;
			margin-top: 1rem;
		}
	}
}
